<!DOCTYPE html >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="icon" type="image/gif" href="slike/animated_favicon1.gif">
<script src="skripte/Cookies.js"></script>
<script src="skripte/proba1.js"></script>
<script src="jQuery/jquery-1.10.2.js"></script>
<script src="skripte/WSMape.js"></script>
<script src="skripte/WSLinije.js"></script>

<LINK href="stilovi/login.css" rel="stylesheet" type="text/css">
<link rel="icon" type="image/gif" href="slike/animated_favicon1.gif">
<LINK href="stilovi/coda-slider.css" rel="stylesheet" type="text/css">
<LINK href="stilovi/templatemo_style.css" rel="stylesheet" type="text/css">


<script src="jQuery/jquery-1.2.6.js" type="text/javascript"></script>
<script src="jQuery/jquery.scrollTo-1.3.3.js" type="text/javascript"></script>
<script src="jQuery/jquery.localscroll-1.2.5.js" type="text/javascript" charset="utf-8"></script>
<script src="jQuery/jquery.serialScroll-1.2.1.js" type="text/javascript" charset="utf-8"></script>
<script src="jQuery/coda-slider.js" type="text/javascript" charset="utf-8"></script>
<script src="jQuery/jquery.easing.1.3.js" type="text/javascript" charset="utf-8"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDowEayIwmDegDQeqkCZgsQuAFj0dnNrUc&sensor=false">
</script>

<script>
var map;
var markers = [];
var suma=0;
var geocoder;

function initialize()
{
	geocoder = new google.maps.Geocoder();

var mapProp = {
  center:new google.maps.LatLng(43.915886, 17.67907600000001),
  zoom:7,
  mapTypeId:google.maps.MapTypeId.ROADMAP,
  draggable: false,
  mapTypeControl: false,
  panControl: false
  };
  map=new google.maps.Map(document.getElementById("googleMap")
  ,mapProp);
	
  google.maps.event.addListener(map, 'click', function(event) {
	    addMarker(event.latLng);
	  });
	dajSveMape();
}

google.maps.event.addDomListener(window, 'load', initialize);
function addMarker(location) {

	
	alert(location);
	  var marker = new google.maps.Marker({
	    position: location,
	    map: map,
	    zoom: 10,
	    draggable: true
	  });
	  insertMapa(marker);	
	  
	  
	  
	}


</script>
<title>Mapa </title>


</head>
<body>

<div id="slider">	
	<div id="templatemo_main">
    	<ul id="social_box">
            <h1> Javna saobraćajna mreža Bosne i Hercegovine </h1>         
        </ul>
        
        <div id="content">
     
            <div class="scroll">
                <div class="scrollContainer">
                
                    <div class="panel" id="home">
                    
                    <strong>Unos novih linija i update postojećih</strong>
                    <button type="button" id="naUsluge" onClick="window.location.href='index.html#gallery'">Početna</button>
					
					<ul>
					<li><small>Lijevi klik na marker otvara sve linije sa početnom stanicom u datoj tački.</small></li>
					<li><small>Desni klik briše početnu stanicu i <b>SVE</b> linije koje počinju iz te stanice</small></li>
					<li><small>Moguće je i pomjerati Početne stanice</small></li>
					</ul>
					<div id="sadrzaj">
					<table style="text-align: left; width: 100%;">
					<tr>
					<td style="width: 500px;"><div id="googleMap" style="width:600px;height:400px;overflow:auto;margin-right:5px;display:block;"></div></td>
					<td style="vertical-align: top;text-align: left;"><div id="listaLinija"> 
					<div id="linije" style="visibility: hidden;">
					<b>Lista linija sa početnom stanicom:<strong id="pocetna" style="size: 10pt;"></strong></b>
					<br>
					<table id="tblLinije" border=0 align="left">
					<tr>
						<th>Naziv linije</th>
						<th>Cijena</th>
						<th>idMape</th>
						<th>Prevoznik</th>
						<th>Autobus</th>
					</tr>
					</table>
					<div id="link" align="justify">
					<a href="linija.html" id="unosLinije">Unos nove linije</a>
					</div>
					</div>
					</div></td>
					</tr>
					</table>

					</div>
                 
                        
                     </div> 
        	            
        	            
                
						</div>
                    </div>
                
                </div>
			</div>
 
        
        </div> 

</body>
</html>